﻿@{
    ViewBag.Title = "";
    List<SelectListItem> typeList = new List<SelectListItem>(){
        new SelectListItem(){Text="请选择类型...", Value=""},
        new SelectListItem(){Text="单行文本", Value="single-text"},
        new SelectListItem(){Text="多行文本", Value="multi-text"},
        new SelectListItem(){Text="编辑器",Value="editor"},
        new SelectListItem(){Text="图片上传",Value="images"},
        new SelectListItem(){Text="视频上传",Value="video"},
        new SelectListItem(){Text="数字",Value="number"},
        new SelectListItem(){Text="时间日期",Value="datetime"},
        new SelectListItem(){Text="复选框",Value="checkbox"},
        new SelectListItem(){Text="多项单选",Value="multi-radio"},
        new SelectListItem(){Text="多项多选",Value="multi-checkbox"},
        new SelectListItem(){Text="同类选择",Value="similar"}
    };
    List<SelectListItem> placeList = new List<SelectListItem>(){
        new SelectListItem(){Text="无小数点",Value="0"},
        new SelectListItem(){Text="一位",Value="1"},
        new SelectListItem(){Text="二位",Value="2"},
        new SelectListItem(){Text="三位",Value="3"},
        new SelectListItem(){Text="四位",Value="4"},
        new SelectListItem(){Text="五位",Value="5"}
    };
}
@model DTcms.Model.article_attribute_field
<form id="form1" class="layui-form" url="AttributeSave?action=@ViewBag.action&id=@ViewBag.id">
    @Html.AntiForgeryToken()
    <!--导航栏-->
    <div class="pageheader">
        <div class="page-bar">
            <ul class="page-breadcrumb">
                <li><a href="../channel/attribute_field_list" class="back"><i class="fa fa-mail-reply-all"></i> 返回列表页</a></li>
                <li><a href="javascript:;"><i class="iconfont icon-home1"></i> 首页</a> </li>
                <li><a href="../channel/attribute_field_list">扩展字段</a> </li>
                <li><a href="javascript:;">编辑字段</a> </li>
            </ul>
        </div>
    </div>
    <!--/导航栏-->
    <!--内容-->
    <div class="layui-fluid">
        <div class="layui-tab layui-tab-card">
            <ul class="layui-tab-title" id="floatHead">
                <li class="layui-this">字段信息</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <div class="layui-form-item">
                        <label class="layui-form-label">控件类型</label>
                        <div class="layui-input-block">
                            @Html.DropDownList("control_type", new SelectList(typeList, "Value", "Text", Model.control_type), new { @lay_filter = "btnSearch", datatype = "*", errormsg = "请选择控件类型！", sucmsg = " " })
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">排序数字</label>
                        <div class="layui-input-block">
                            @Html.TextBox("sort_id", Model.sort_id, new { @class = "input small", datatype = "n", sucmsg = " " })
                            <span class="Validform_checktip">*数字，越小越向前</span>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">字段列名</label>
                        <div class="layui-input-block">
                            @Html.TextBox("name", Model.name, new { @class = "input normal", datatype = @"/^[a-zA-Z0-9\-\_]{2,50}$/", sucmsg = " ", ajaxurl = "/admin_ajax/attribute_field_validate" })
                            <span class="Validform_checktip">*字母、下划线，不可修改</span>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">字段标题</label>
                        <div class="layui-input-block">
                            @Html.TextBox("title", Model.title, new { @class = "input normal", datatype = "*", sucmsg = " " })
                            <span class="Validform_checktip">*中文标题，做为备注</span>
                        </div>
                    </div>
                    <div id="ControlType"></div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">默认值</label>
                        <div class="layui-input-block">
                            @Html.TextBox("default_value", Model.default_value, new { @class = "input normal" })
                            <span class="Validform_checktip">*控件的默认字符，可为空</span>
                        </div>
                    </div>
                    <div id="Valid"></div>
                </div>
            </div>
        </div>
    </div>
    <!--/内容-->
    <!--工具栏-->
    <div class="page-footer">
        <div class="btn-wrap">
            <button class="layui-btn icon-btn" id="btnSubmit"><i class="layui-icon layui-icon-ok"></i>提交保存</button>
            <button class="layui-btn layui-btn-warm icon-btn" name="btnReturn" onclick="javascript:history.back(-1);"><i class="layui-icon layui-icon-return"></i>返回上一页</button>
        </div>
    </div>
    <!--/工具栏-->
</form>
<script type="text/html" id="IsRequired">
    <div class="layui-form-item">
        <label class="layui-form-label">是否必填</label>
        <div class="layui-input-block">
            @Html.CheckBox("is_required", Model.is_required == 1, new { title = "是" })
        </div>
    </div>
</script>
<script type="text/html" id="IsPassWord">
    <div class="layui-form-item single-text-tr">
        <label class="layui-form-label">是否密码框</label>
        <div class="layui-input-block">
            @Html.CheckBox("is_password", Model.is_password == 1, new { title = "是" })
        </div>
    </div>
</script>
<script type="text/html" id="IsHtml">
    <div class="layui-form-item multi-text-tr">
        <label class="layui-form-label">是否允许HTML</label>
        <div class="layui-input-block">
            @Html.CheckBox("is_html", Model.is_html == 1, new { title = "是" })
        </div>
    </div>
</script>
<script type="text/html" id="EditorType">
    <div class="layui-form-item editor-tr">
        <label class="layui-form-label">编辑器类型</label>
        <div class="layui-input-block">
            @Html.RadioButton("editor_type", 0, Model.editor_type == 0, new { title = "标准型" })
            @Html.RadioButton("editor_type", 1, Model.editor_type == 1, new { title = "简洁型" })
        </div>
    </div>
</script>
<script type="text/html" id="DataType">
    <div class="layui-form-item multi-radio-tr">
        <label class="layui-form-label">字段类型</label>
        <div class="layui-input-block">
            @Html.RadioButton("data_type", "nvarchar", Model.data_type == "nvarchar", new { title = "字符串" })
            @Html.RadioButton("data_type", "int", Model.data_type == "int", new { title = "整型数字" })
        </div>
    </div>
</script>
<script type="text/html" id="DataLength">
    <div class="layui-form-item single-text-tr multi-text-tr multi-radio-tr multi-checkbox-tr">
        <label class="layui-form-label">字符串长度</label>
        <div class="layui-input-block">
            @Html.TextBox("data_length", Model.data_length, new { @class = "input small", datatype = "n", sucmsg = " " })
            <span class="Validform_checktip">*数字，默认50个字符</span>
        </div>
    </div>
</script>
<script type="text/html" id="DataPlace">
    <div class="layui-form-item number-tr">
        <label class="layui-form-label">小数点位数</label>
        <div class="layui-input-block">
            @Html.DropDownList("data_place", new SelectList(placeList, "Value", "Text", Model.data_place))
            <span class="Validform_checktip">*无小数点为整型，否则浮点数</span>
        </div>
    </div>
</script>
<script type="text/html" id="ItemOption">
    <div class="layui-form-item multi-radio-tr multi-checkbox-tr">
        <label class="layui-form-label">选项列表</label>
        <div class="layui-input-block">
            @Html.TextArea("item_option", Model.item_option, new { @class = "input", datatype = "*", sucmsg = " " })
            <span class="Validform_checktip">*以换行为一行</span>
            <div>*填写说明：选项名称|值，以回车换行为一行。</div>
        </div>
    </div>
</script>
<script type="text/html" id="ValidPattern">
    <div class="layui-form-item">
        <label class="layui-form-label">验证正则表达式</label>
        <div class="layui-input-block">
            @Html.TextArea("valid_pattern", Model.valid_pattern, new { @class = "input" })
            <span class="Validform_checktip">*不填写则不验证</span>
        </div>
    </div>
</script>
<script type="text/html" id="ValidTipMsg">
    <div class="layui-form-item">
        <label class="layui-form-label">验证提示信息</label>
        <div class="layui-input-block">@Html.TextArea("valid_tip_msg", Model.valid_tip_msg, new { @class = "input" })</div>
    </div>
</script>
<script type="text/html" id="ValidErrorMsg">
    <div class="layui-form-item">
        <label class="layui-form-label">验证失败信息</label>
        <div class="layui-input-block">@Html.TextArea("valid_error_msg", Model.valid_error_msg, new { @class = "input" })</div>
    </div>
</script>
@section Scripts{
    <script type="text/javascript">
        layui.use(['validform','jqueryform', 'element', 'form'], function () {
            var form = layui.form, $ = layui.jquery;
            $("#form1").initValidform('#btnSubmit', 1);

            form.on('select(btnSearch)', function (data) {
                changeQT(data.value);
            });
            setTimeout(function () {
                changeQT("@Model.control_type");
            }, 50);
            function changeQT(value) {
                var IsRequired = $("#IsRequired").html(), IsPassWord = $("#IsPassWord").html(), IsHtml = $("#IsHtml").html(), EditorType = $("#EditorType").html(),
                    DataType = $("#DataType").html(), DataLength = $("#DataLength").html(), DataPlace = $("#DataPlace").html(), ItemOption = $("#ItemOption").html(),
                    ValidPattern = $("#ValidPattern").html(), ValidTipMsg = $("#ValidTipMsg").html(), ValidErrorMsg = $("#ValidErrorMsg").html();
                var control = $("#ControlType"), valid = $("#Valid");
                control.html('');
                valid.html('');
                switch (value) {
                    case "single-text": //单行文本
                        control.append(IsRequired + IsPassWord + DataLength);
                        valid.append(ValidPattern + ValidTipMsg + ValidErrorMsg);
                        break;
                    case "multi-text": //多行文本
                        control.append(IsRequired + IsHtml + DataLength);
                        valid.append(ValidPattern + ValidTipMsg + ValidErrorMsg);
                        break;
                    case "editor": //编辑器
                        control.append(IsRequired+EditorType);
                        valid.append(ValidPattern + ValidTipMsg + ValidErrorMsg);
                        break;
                    case "images": //图片上传
                        control.append(IsRequired );
                        valid.append(ValidPattern + ValidTipMsg + ValidErrorMsg);
                        break;
                    case "video": //视频上传
                        control.append(IsRequired );
                        valid.append(ValidPattern +ValidTipMsg+ ValidErrorMsg);
                        break;
                    case "number": //数字
                        control.append(IsRequired + DataPlace);
                        valid.append(ValidPattern + ValidTipMsg + ValidErrorMsg);
                        break;
                    case "datetime": //时间日期
                        control.append(IsRequired);
                        valid.append(ValidPattern +ValidTipMsg+ ValidErrorMsg);
                        break;
                    case "checkbox": //复选框
                        control.append(IsRequired);
                        valid.append(ValidTipMsg);
                        break;
                    case "multi-radio": //多项单选
                        control.append(IsRequired + DataType + DataLength + ItemOption);
                        valid.append(ValidTipMsg);
                        break;
                    case "multi-checkbox": //多项多选
                        control.append(DataLength + IsRequired);
                        valid.append(ItemOption + ValidTipMsg);
                        break;
                    case "similar": //同类选择
                        control.append(DataLength);
                        break;
                }
                form.render();
            }
        });
    </script>
}
